<template>
  <div class="myDiv">

    <div ref="chart" style="width: 100; height: 350px;"></div>

  </div>
</template>

<script>
import * as echarts from 'echarts';

export default {
  name: '',
  components:{
},
  props:{
},
  data(){
    return {
      // 柱状图数据
      LineData: {
   
  tooltip: {
    trigger: 'axis'
  },
  legend: {
    data: ['20岁-25岁', '25岁-30岁', '30岁-35岁', '35岁-40岁']
  },
  grid: {
    left: '3%',
    right: '4%',
    bottom: '3%',
    containLabel: true
  },
  toolbox: {
    feature: {
      saveAsImage: {}
    }
  },
  xAxis: {
    type: 'category',
    boundaryGap: false,
    data: [ '2020', '2021', '2022', '2023', '2024']
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      name: '20岁-25岁',
      type: 'line',
      stack: 'Total',
      data: [13, 10 ,12, 20,15]
    },
    {
      name: '25岁-30岁',
      type: 'line',
      stack: 'Total',
      data: [15, 15, 20, 15,13]
    },
    {
      name: '30岁-35岁',
      type: 'line',
      stack: 'Total',
      data: [15, 20,  15, 12,9]
    },
    {
      name: '35岁-40岁',
      type: 'line',
      stack: 'Total',
      data: [12,10, 8, 8,8]
    }
  ]
      }
    }
  },
  watch:{
},
  computed:{
},
  methods:{
    renderBarChart() {
      const chart = echarts.init(this.$refs.chart);
      chart.setOption(this.LineData);
    }
},
  created(){

   
},
  mounted(){
    this.renderBarChart();
}
}
</script>
<style lang="scss" scoped>

</style>